<template>
	<div class="head">
		<div style="float: left;width: 420px;height: 160px;"></div>
		<div class="head_right">
			<router-link to="/" style="padding: 0 15px 0 20px">
				首页
			</router-link>
			<router-link to="/newbookup" style="padding: 0 30px 0 40px">
				新书上架
			</router-link>
			<router-link to="/specialbook" style="padding: 0 35px">
				特价书
			</router-link>
			<router-link to="/memberchange" style="padding: 0 5px 0 25px">
				会员修改
			</router-link>
			<router-link to="/shopping" style="padding: 0 35px">
				购物车
			</router-link>
			<router-link to="/orderform" style="padding: 0 15px">
				查看订单
			</router-link>
			<router-link to="/balance" style="padding: 0 30px">
				销售排行
			</router-link>
		</div>
	</div>
</template>

<script>
	export default {
		name: "Header",
	}
</script>

<style scoped>
	.head {
		height: 140px;
		width: 100%;
		background-image: url("@/assets/img/head.jpg");
		background-repeat: no-repeat;
	}

	.head_right {
		width: 100%;
		height: 60px;
		padding-top: 100px;
	}

	.head_right>a {
		width: 100px;
		/*border: 1px solid red;*/
		text-decoration: none;
		color: black;
	}

	.head_right>a:hover {
		color: blue;
		text-decoration: underline;
	}
</style>
